<template>
  <div class="city">
    <CityHeader :cities="cityList.cities" />
    <CityList :hotCities="cityList.hotCities" :cities="cityList.cities" />
  </div>
</template>

<script setup>
import CityHeader from './components/CityHeader.vue'
import CityList from './components/CityList.vue'
import axios from 'axios'
import { ref, onMounted } from 'vue'

const cityList = ref({})
const getCityList = async () => {
  // cityList.value = await axios.get('/public/mock/city.json').then(res => res.data.data)
  cityList.value = await axios.get('/api/city.json').then(res => res.data.data)
  console.log(cityList.value)
}
onMounted(() => {
  getCityList()
})
</script>

<style>

</style>
